{% extends 'themes/default/public/layout.html' %}

{% block style %}
<style>
    .pe_herader {
        // background: url("/static/themes/default/images/users_bg.jpg") no-repeat;
        height: 200px;
        background-size: 100%;
    }
    .pe_herader .info {
        text-align: center;
        margin-top: 70px;
    }
    .pe_herader .info img {
        width: 70px;
    }
    .pe_herader .info span {
        display: block;
        color: black;
    }
    .pe_herader .info .name {
        font-size: 20px;
        margin: 5px 0;
    }
    .pe_herader .info .des {

    }
    .pe_content {
        padding: 0;
    }
    .pe_content .nav {
        overflow: hidden;
        background: #c7c7c7;
        color: white;
    }
    .pe_content .nav li {
        float: left;
        padding: 10px 15px;
        cursor: default;
        color: white;
    }
    .pe_content .nav li:hover {
        background: #8e8d8d;
    }
    .pe_content .nav li.active {
        background: #8e8d8d;
    }
    .pe_content .main {
        padding: 10px;
        background: #54947f;
        color: white;
    }
    .pe_content .main .box {
        display: none;
    }
    .pe_content .main .box li {
        margin: 5px 0;
    }
    .pe_content .main .box li a {
        color: white;
        padding: 5px 0;
        display: block;
        transition: all .5s;
    }
    .pe_content .main .box li:hover {
        background: #2d8a6c;
    }
    .pe_content .main .box li:hover a {
        padding-left: 10px;
    }
</style>
{% endblock %}

{% block body %}
<div class="mdui-container-fluid">
    <div class="nexmoe-item">
        <div class="mdui-row layui-row layui-col-space15">
            <div class="pe_herader">
                <div class="info">
                    <img src="{{ data.avatar }}" alt="">
                    <span class="name">
                        <strong>
                            {{ data.nickname }}
                        </strong>
                    </span>
                    <span class="des">
                        {{ data.description }}
                    </span>
                </div>
            </div>
            <div class="pe_content">
                <div class="nav">
                    <ul>
                        <li class="active">
                            主题
                        </li>
                        <li>
                            回复
                        </li>
                    </ul>
                </div>
<!--                <div class="main">-->
<!--                    <div class="box" style="display: block">-->
<!--                        <ul>-->
<!--                            <li>-->
<!--                                <a href="">这是我发布的内容呀！</a>-->
<!--                            </li>-->
<!--                            <li>-->
<!--                                <a href="">这是我发布的内容呀！</a>-->
<!--                            </li>-->
<!--                            <li>-->
<!--                                <a href="">这是我发布的内容呀！</a>-->
<!--                            </li>-->
<!--                        </ul>-->
<!--                    </div>-->
<!--                </div>-->
            </div>
        </div>
    </div>
</div>
{% endblock %}

{% block script %}
{% endblock %}